<template>
  <div class="cards">
    <geth-info-card
      v-for="(item, index) in data"
      :ip="item.ip"
      :alive="item.alive"
      :miner="item.miner"
      :key="index"
    ></geth-info-card>
  </div>
</template>

<script>
import GethInfoCard from "@/components/GethInfoCard.vue";

export default {
  components: {
    GethInfoCard,
  },
  data() {
    return {
      data: [],
    };
  },
  methods: {
    getGethInfo() {
      this.$axios.get("/geth/info").then((res) => {
        this.data = res.data;
      });
    },
  },
  created() {
    this.getGethInfo();
  },
};
</script>

<style scoped>
.cards {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
}
</style>